<template>
	<view>
		<!--   标 题  -->
		<view class="notes">
			<p><span>*</span>申请绑定信息</p>
		</view>
		<!-- 信息  -->
		<u-toast ref="uToast"></u-toast>
		<view class="uni-common-mt">
			<view class="uni-form-item uni-column user-input">
				<view style="width: 100px; font-size: 16px;">设备序列号:</view>
				<view class="input">
					<text class="info">{{serialnumber}}</text>
				</view>
			</view>
			<u-gap height="3px" bgColor="#ffffff "></u-gap>
			<view class="uni-form-item uni-column user-input" >
				<view style="width: 80px; font-size: 16px;">设备类型:</view>
				<view class="input">
					<text class="info">{{devicetype}}</text>
				</view>
			</view>
			<u-gap height="3px" bgColor="#ffffff "></u-gap>
			<view class="uni-form-item uni-column user-input" >
				<view style="width: 80px; font-size: 16px;">设备型号:</view>
				<view class="input">
					<text class="info">{{devicemodel}}</text>
				</view>
			</view>
			<u-gap height="3px" bgColor="#ffffff "></u-gap>
			<view class="uni-form-item uni-column user-input" >
				<view style="width: 80px; font-size: 16px;">生产日期:</view>
				<view class="input">
					<text class="info">{{deliverytime}}</text>
				</view>
			</view>
			<u-gap height="3px" bgColor="#ffffff "></u-gap>
			<view class="uni-form-item uni-column user-input" >
				<view style="width: 80px; font-size: 16px;">客户名称:</view>
				<view class="input">
					<text class="info">{{customername}}</text>
				</view>
			</view>
			<u-gap height="3px" bgColor="#ffffff "></u-gap>
			<view class="uni-form-item uni-column user-input" >
				<view style="width: 80px; font-size: 16px;">申请人员:</view>
				<view class="input">
					<text class="info">{{binder}}</text>
				</view>
			</view>
			<u-gap height="3px" bgColor="#ffffff "></u-gap>
			<view class="uni-form-item uni-column user-input" >
				<view style="width: 80px; font-size: 16px;">电话:</view>
				<view class="input">
					<text class="info">{{customerphone}}</text>
				</view>
			</view>
			<u-gap height="3px" bgColor="#ffffff "></u-gap>
			<view class="uni-form-item uni-column user-input" >
				<view style="width: 80px; font-size: 16px;">职位:</view>
				<view class="input">
					<text class="info">{{position}}</text>
				</view>
			</view>
			<u-gap height="3px" bgColor="#ffffff "></u-gap>
			<view class="uni-form-item uni-column user-input" >
				<view style="width: 80px; font-size: 16px;">所属公司:</view>
				<view class="input">
					<text class="info">{{affiliatedCompany}}</text>
				</view>
			</view>
			<u-gap height="3px" bgColor="#ffffff "></u-gap>
			<view class="uni-form-item uni-column user-input" >
				<view style="width: 80px; font-size: 16px;">所属部门:</view>
				<view class="input">
					<text class="info">{{affiliatedDept}}</text>
				</view>
			</view>
			<u-gap height="3px" bgColor="#ffffff "></u-gap>
			<view class="uni-form-item uni-column user-input" >
				<view style="width: 80px; font-size: 16px;">申请日期:</view>
				<view class="input">
					<text class="info">{{requestTime}}</text>
				</view>
			</view>
			<u-gap height="3px" bgColor="#ffffff "></u-gap>
			<view v-if="show">
				<text style="margin-left: 20px; margin-top: 15px; font-size: 16px;">请领导审批:</text>
				<view style="margin-left: 30px; margin-top: 15px;">
				<view class="u-page__radio-item">
					<u-radio-group
						v-model="radiovalue"
						placement="row"
						iconColor="#ffffff">
						<u-radio
							:customStyle="{marginRight: '16px'}"
							v-for="(item, index) in radiolist"
							:key="index"
							:label="item.name"
							:name="item.name"
							@change="radioChange"
							>
						</u-radio>
					</u-radio-group>
				</view>
			</view>
			</view>
			<view class="uni-form-item uni-column user-input">
				<view style="width: 70px; font-size: 16px;">驳回理由:</view>
				<view class="input">
					<u--input placeholder="请输入驳回理由"  border="surround" v-model="reason" type="text" clearableb v-if="reasonShow "></u--input>
					<text class="info" v-else>{{reason}}</text> 
				</view>
			</view>
		
		</view>
		
		<button class="appro-bt" @click="appro" v-if="show">审批</button>
		<u-gap height="60px" bgColor="#ffffff "></u-gap>
		
	</view>
</template>

<script>
	let item;
	export default{
		data(){
			return{
				show: false,
				reasonShow: false,
				radiovalue: '同意',
				//横向排列形式数据
				radiolist: [{
						name: '同意',
						disabled: false
					},
					{
						name: '不同意',
						disabled: false
					},
				],
				serialnumber: '',
				devicetype: '',
				devicemodel: '',
				deliverytime: '',
				customername: '',
				binder: '',
				customerphone: '',
				position: '',
				affiliatedCompany: '',
				affiliatedDept: '',
				requestTime: '',
				reason: '',
				bindrequestid: '',
				status: ''
			}
		},
		onLoad(option) {
			item = JSON.parse(decodeURIComponent(option.data));
			console.log("---申请  id ---"+"-----"+item.bindrequestid)
			this.serialnumber = item.serialnumber;
			this.devicetype = item.devicetype;
			this.devicemodel = item.devicemodel;
			this.deliverytime = item.deliverytime;
			this.customername = item.customername;
			this.binder = item.binder;
			this.customerphone = item.customerphone;
			this.position = item.position;
			this.affiliatedCompany = item.affiliatedCompany;
			this.affiliatedDept = item.affiliatedDept;
			this.requestTime = item.requestTime;
			this.bindrequestid = item.bindrequestid;
			this.status = item.status;
			this.reason = item.reason;
			if(this.status == "待审批"){
				this.show = true;
			}
		},
		methods:{
			appro(){
				
				let adminOpenid = uni.getStorageSync("adminOpenid");
				let timeOk = null;
				let timeNo = null;
				if(this.radiovalue == "同意"){
					console.log("--- 审批 ----",this.radiovalue);
					uni.request({
					url: "https://www.smacaftersales.com:443/bindRequest/bindRequest/passThrough",
					method: 'POST',
					data:{
						bindrequestid: this.bindrequestid,
						serialnumber: this.serialnumber,
						devicetype: this.devicetype,
						devicemodel: this.devicemodel,
						deliverytime: this.deliverytime,
						customername: this.customername,
						customerphone: this.customerphone,
						position: this.position,
						binder: this.binder,
						openid: adminOpenid
					},
					header: {
						"Content-Type": "application/json" ,//请求头信息
					},
					success(res) {
						console.log("--------",res);
						if(res.data.msg == "操作成功"){
							uni.showToast({
								title: "审批通过",
								duration: 1888,
								icon: 'success'
							})
							timeOk = setTimeout( () => {
								uni.navigateTo({
									url: '/pages/adminVue/DeviceBindingApprovaList'
								})			
							}, 2000)
							
						}
						
					}
				})
					
				}else {   //  驳回 
					console.log("----驳回----",this.radiovalue,"----理由--",this.reason,"----申请id---",this.bindrequestid)
					if(this.reason == "" || this.reason == null){
						uni.showToast({
							title:"请填写驳回理由",
							duration: 1500,
							icon: 'none'
						})
					}else{
						uni.request({
							url: "https://www.smacaftersales.com:443/bindRequest/bindRequest/bindApplicationRejected",
							method: 'POST',
							data:{
								bindrequestid: this.bindrequestid,
								status: "已驳回",
								reason: this.reason
							},
							header: {
								"Content-Type": "application/json" ,  //请求头信息
							},
							success(res) {
								console.log("--------",res);
								if(res.data.msg == "操作成功"){
									uni.showToast({
										title: "审批已驳回",
										duration: 1888,
										icon: 'success'
									})
									timeNo = setTimeout( () => {
										uni.navigateTo({
											url: '/pages/adminVue/DeviceBindingApprovaList'
										})			
									}, 2000)
								}
								
							}
						})
					}
					
				}
			},
			
			radioChange(n){     // 单选框 状态
				this.radiovalue = n;
				switch (n){
					case '不同意':
						this.reasonShow = true
						break;
					case '同意':
						this.reasonShow = false
						break;
				}
			},
		},
		
		
	}
	
	
</script>

<style lang="scss">
	page {
	       background-color: #ffffff;
	   }
	.appro-bt{
		width: 200px;
		margin-top: 50px;
		border-radius: 25px;
		border: 3rpx solid #00a3f5;
	}
	.notes{
		width: 20%px;
		margin: 0px auto 30px;
		font-size: 14px;
		
		span{
			color: red;
			margin-right: 4px;
		}
		p{
			color: #999;
		}
	}
	.info{
		font-size: 17px;
		color: #ababab;
	}
	.title{
		width: 80px;
		height: 22px;
		font-size: 16px;
	}
	
	.user-input{
		width: 335px;
		margin: 10px auto;
		display: flex;
		.input{
			width: 260px;
			margin-left: 10px;
		}
	}
	.fenjie{
		width: 335px;
		height: 1px;
		background: #ddd;
		margin: 0 auto;
	}
	
	.up-button{
		width: 160px;
		height:40px;
		background: #488ac7;
		border-radius: 4px;
		font-size: 16px;
		line-height: 40px;
		color: white;
		margin-top: 30px;
	}
</style>